import React, { Component } from 'react';
import Progress from 'components/Progressbar/Progressbar'
import Button from 'components/UIButton/UIButton'


import { RecommendedStyled } from './RecommendedStyled'
import header  from 'images/hall/touxiang2@3x.png'
import dj  from 'images/hall/dj_l1@3x.png'

// class Recommended extends Component {
//   render() {
function Recommended(props){
    return (
      <RecommendedStyled>
        <img onClick={()=>(props.data.hdimg?props.clickHeadImg():console.log('clickBossImg'))}  className="bossImg" src={props.data.hdimg} alt=""/>

        <div className="recommendedInfoWrap"
        >
          <div className="one">
            <p className="nichen">{props.data.uname||'暂无'}</p>          
          </div>
          <div className="two">
            {/* <img className="djimg" src={dj} alt=""/> */}
            <Progress
            width='1.3rem'
            height= '.05rem'
            borderRadius = '.02rem'
            progressWidth={props.data.jd}
            progressColor = '#56D9D1'
            ></Progress>
            <p>{props.data.dj}</p>
          </div>

          <div className="three">
            <p>未添加个性签名</p>
          </div>
        </div>
        <Button
        width='.6rem'
        height='.3rem'
        borderRadius='.05rem'
        border= '1px solid #ebebeb'
        title='加关注'
        titleColor = '#646464'
        titleSize = '.11rem'
        clickButton={()=>(props.clickRecommendedInfo?props.clickRecommendedInfo():console.log('clickRecommended'))}
        ></Button>
      </RecommendedStyled>
    );
  // }
}

export default Recommended;